import { createTableBottomInnovation } from '@/content-scripts/components/trading/innovationZone/bottomTable.js'
let innovationTableObserver = null;

export function createInnovationTable() {
    if (innovationTableObserver) innovationTableObserver.disconnect();

    let previousValues = {
        firstStageTabs: null
    };

    innovationTableObserver = new MutationObserver(() => {
        const tabBtn = document.querySelector(
            ".bottom_box > .tr-select-none > .order_trade_tabs_left > div.bottomBar_active"
        );
        const hasChanged =
            tabBtn.innerHTML != previousValues.firstStageTabs
        if (tabBtn && hasChanged) {
            previousValues = {
                firstStageTabs: tabBtn.innerHTML
            }
            tabsClassify(tabBtn.innerHTML)
        }
    });
    innovationTableObserver.observe(document.body, {
        childList: true,
        subtree: true,
        attributes: true,
        characterData: true,
    });
}

function tabsClassify(value) {
    console.log(value, 'wwwwwwwwwwwwwwwww');

    if (value == '我的持仓') {
        createTableBottomInnovation({ firstStageTabs: value })
    } else if (value == '历史仓位' || value == '成交记录') {
        createHistoryHolding(value)
    } else if (value == '当前委托') {
        createCurrentCommission(value)
    } else if (value == '委托历史') {
        createCommissionHistory(value)
    }
}

let historyHoldingObserver = null

function createHistoryHolding(value) {
    if (historyHoldingObserver) historyHoldingObserver.disconnect();
    if (currentCommissionObserver) currentCommissionObserver.disconnect();
    if (commissionHistoryObserver) commissionHistoryObserver.disconnect();

    let previousValues = {
        firstStageTabs: value,
        incomeValue: null,
        // timeIntervalValue: null,
        startTimeValue: null,
        endTimeValue: null
    };

    historyHoldingObserver = new MutationObserver(() => {
        const incomeInput = document.querySelector(
            ".mantine-1b20kon > div > .mantine-dcm9q0 > .mantine-wz61vw"
        );
        // const timeInterval = document.querySelector('.mantine-1t5amwr .tr-text-c-text-5');
        const startTime = document.querySelector('.mantine-15kxfbj > .mantine-7lvkc8 > .mantine-1626jtb');
        const endTime = document.querySelector('.mantine-15kxfbj > .mantine-7lvkc8 > .mantine-17whd58');


        const hasChanged =
            incomeInput.value != previousValues.incomeValue ||
            // timeInterval.textContent !== previousValues.timeIntervalValue ||
            startTime.value !== previousValues.startTimeValue ||
            endTime.value !== previousValues.endTimeValue
        if (incomeInput && startTime && endTime && hasChanged) {
            previousValues = {
                firstStageTabs: value,
                incomeValue: incomeInput.value,
                // timeIntervalValue: timeInterval.textContent,
                startTimeValue: startTime.value,
                endTimeValue: endTime.value
            }
            createTableBottomInnovation(previousValues)
        }
    });
    historyHoldingObserver.observe(document.body, {
        childList: true,
        subtree: true,
        attributes: true,
        characterData: true,
    });
}

let currentCommissionObserver = null

function createCurrentCommission(value) {
    if (historyHoldingObserver) historyHoldingObserver.disconnect();
    if (currentCommissionObserver) currentCommissionObserver.disconnect();
    if (commissionHistoryObserver) commissionHistoryObserver.disconnect();

    let previousValues = {
        firstStageTabs: value,
        actionvalue: null,
        networkValue: null
    };

    currentCommissionObserver = new MutationObserver(() => {
        const actionInput = document.querySelector(
            ".mantine-125u5pf > div > .mantine-dcm9q0 > .mantine-wz61vw"
        );
        const networkInput = document.querySelector(
            ".mantine-4tifmn > div > .mantine-dcm9q0 > .mantine-wz61vw"
        );

        const hasChanged =
            actionInput.value != previousValues.actionvalue ||
            networkInput.value !== previousValues.networkValue
        if (actionInput && networkInput && hasChanged) {
            previousValues = {
                firstStageTabs: value,
                actionvalue: actionInput.value,
                networkValue: networkInput.value
            }
            createTableBottomInnovation(previousValues)
        }
    });
    currentCommissionObserver.observe(document.body, {
        childList: true,
        subtree: true,
        attributes: true,
        characterData: true,
    });
}

let commissionHistoryObserver = null

function createCommissionHistory(value) {
    if (historyHoldingObserver) historyHoldingObserver.disconnect();
    if (currentCommissionObserver) currentCommissionObserver.disconnect();
    if (commissionHistoryObserver) commissionHistoryObserver.disconnect();

    let previousValues = {
        firstStageTabs: value,
        priceTypevalue: null,
        transactionTypeValue: null,
        // timeIntervalValue: null,
        startTimeValue: null,
        endTimeValue: null
    };

    commissionHistoryObserver = new MutationObserver(() => {
        const priceTypeSelect = document.querySelector(
            ".mantine-cw6wfo > div > .mantine-dcm9q0 > .mantine-wz61vw"
        );
        const transactionTypeSelect = document.querySelector(
            ".mantine-1b20kon > div > .mantine-dcm9q0 > .mantine-wz61vw"
        );
        // const timeInterval = document.querySelector('.mantine-1t5amwr .tr-text-c-text-5');
        const startTime = document.querySelector('.mantine-15kxfbj > .mantine-7lvkc8 > .mantine-1626jtb');
        const endTime = document.querySelector('.mantine-15kxfbj > .mantine-7lvkc8 > .mantine-17whd58');


        const hasChanged =
            priceTypeSelect.value != previousValues.priceTypevalue ||
            transactionTypeSelect.value !== previousValues.transactionTypeValue ||
            // timeInterval.textContent !== previousValues.timeIntervalValue ||
            startTime.value !== previousValues.startTimeValue ||
            endTime.value !== previousValues.endTimeValue
        if (priceTypeSelect && transactionTypeSelect && startTime && endTime && hasChanged) {
            previousValues = {
                firstStageTabs: value,
                priceTypevalue: priceTypeSelect.value,
                transactionTypeValue: transactionTypeSelect.value,
                // timeIntervalValue: timeInterval.textContent,
                startTimeValue: startTime.value,
                endTimeValue: endTime.value
            }
            createTableBottomInnovation(previousValues)
        }
    });
    commissionHistoryObserver.observe(document.body, {
        childList: true,
        subtree: true,
        attributes: true,
        characterData: true,
    });
}